event.cancelBubble
-------------------
div1 has onclick alert1, div2 has onclick alert2. so the document hierarchy(tree formation) knows which to alert first and second and so on.
Now if we want to cancel the alert1; when click of alert2, then event.cancelBubble  stops bubbling through the document hierarchy. 


returnValue (or) preventDefault
----------------------------------
To cancel any default action associated with the event.

Provides the value to be returned to the event's source element to allow or prohibit the element's default action connected with the event. If you set event.returnValue to false, the element does not carry out its normal operation, such as navigating to a link or submitting the form or character to print at the input text. This property does not influence an actual value you may wish to return from an event handler function.

============================================================================================
<script language="JavaScript">
    function function1(e) {
        e.preventDefault(); // stoping moving to abc.htm		
    }
</script>
<a href="abc.html" onClick="function1(event);">navioo.com Home page</a>
=============================================================================================
<script>
	function canelEventAfterRadioClick(e, str){
	    alert("canelEventAfterRadioClick : "+str);
        e.cancelBubble = true;
	}
</script>
<BODY onclick="alert('<BODY>');">
	<FORM NAME="MAINFORM" style="background-color:yellow" onclick="alert('MAINFORM');">
		Name : <INPUT TYPE="TEXT" NAME="TEXT1" onclick="alert('TEXT1');event.cancelBubble=true;"><BR>
		Male<INPUT TYPE="RADIO" NAME="R1" VALUE="RADIO1" onclick="canelEventAfterRadioClick(event, 'RADIO1');">&nbsp;&nbsp;&nbsp;Female<INPUT TYPE="RADIO" NAME="R1" VALUE="RADIO2" onclick="canelEventAfterRadioClick(event, 'RADIO2');"><BR>
		Desc : <textarea name='area' onclick="alert('TEXT-AREA');"></textarea>
	</FORM>
</BODY>

=========================================================================================
<script>
	function aAlert(e){
	    alert("aAlert(e)");
        e.cancelBubble = true; // stoping the div tag alert
		if(e.preventDefault)e.preventDefault(); // stoping moving to abc.htm
		else e.returnValue = false;
	}
	function aOutSideAlert(e){
	    alert("aOutSideAlert");
	    if(e.which){
            alert('others preventDefault');
			e.preventDefault();
		}
		else{
            alert('ie returnValue');
			e.returnValue = false;
		}
	}
</script>
<style>
    div{
        width : 500px ;
        height : 50px ;
        border : 2px solid ;
    }
</style>
<div onclick="alert('div');">
    <a href="abc.htm" onclick="aAlert(event);">click</a>
</div>
<br/>
<a href="abc2.htm" onclick="aOutSideAlert(event);">click</a>
<br/>
<a href="someLink.html" onclick="return(false);">Text</a>
==============================================================================================

Below program will not in Mozilla because window.event is not been identified

<script language="JavaScript">
function function1() {
    if (window.event.shiftKey){
        window.event.cancelBubble = true;
    }
    alert(window.event.cancelBubble);
}
</script>
<button onclick="function1();">Click here while pressing the Shift key</button>

							-----Or---------------

<script language="JavaScript">
function function1(e) {
    if (e.shiftKey){
        e.cancelBubble = true;
    }
    alert(e.cancelBubble);
}
</script>
<button onclick="function1(event);">Click here while pressing the Shift key</button>

=============================================================================================


<script>
	function fn1(){
		alert("fn1");
	}
	function fn2(){
		alert("fn2");
	}
</script>


<A HREF="c:" onclick="alert('The Hyperlink has been cancelled.');return false;">C drive</A>
<BR>
<A HREF="c:" onclick="return false;alert('The Hyperlink has been cancelled.');">Drive C</A>

<hr/>

<A HREF="c:" onclick="alert('The Hyperlink has been cancelled.'); event.returnValue=false;">C drive</A>
<BR>
<A HREF="c:" onclick="event.returnValue=false;alert('The Hyperlink has been cancelled.');">Drive C</A>

<hr/> 
<b>Function calling</b>
</br>

<A HREF="c:" onclick="fn1();return false;fn2();">C drive</A>
<BR>
<A HREF="c:" onclick="return false;fn1();">Drive C</A>

<hr/>

<A HREF="ab.htm" onclick="fn1(); event.cancelBubble=true; fn2();">C drive</A>
<BR>
<A HREF="ab.htm" onclick="event.cancelBubble=true; fn1(); fn2();">Drive C</A>
===============================================================================================

<script type="text/javascript">
	function checkKeyType(e) {

		var code = 0;
		if(e.charCode == undefined)	code = e.keyCode;		
		else if(e.charCode != 0) code = e.which;
		return code;
	}
	function allow_only_digits_phone(e)	{
		
		var code = checkKeyType(e);
		if( code!=0 && ( code<48 || code>57 ) )	{
			alert("Please enter only digits");				
			if(e.which)	e.preventDefault();
			else e.returnValue = false;				
		}
	}
</script>
Please eneter only numbers : <input type="text" onkeypress="allow_only_digits_phone(event);"/>

